<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>用户列表</title>
    <link href="asserts/css/bootstrap.min.css" th:href="@{/webjars/bootstrap/4.0.0/css/bootstrap.css}" rel="stylesheet">
    <link href="asserts/css/bootstrap.min.css" th:href="@{/webjars/bootstrap/4.0.0/css/bootstrap.min-jsf.css}" rel="stylesheet">
    <script th:src="@{/webjars/jquery/jquery.min.js}"></script>
    <link rel="icon" th:href="@{/img/favicon.ico}"/>
</head>
<body>


<div class="container">

    <div class="col-12">
        <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link" href="#">首页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">用户信息</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">个人资料</a>
                </li>
            </ul>

        </nav>
    </div>

    <div class="col-12" style="margin-top: 50px"><span style="text-align: center">用户列表</span></div>
    <div class="col-10" style="margin-top: 50px">
        <table class="table table-striped">
            <thead>
            <tr>
                <th>序号</th>
                <th>姓名</th>
                <th>密码</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="user:${users}">
                <td th:text="${user.id}"></td>
                <td th:text="${user.username}"></td>
                <td th:text="${user.password}"></td>
                <td>
                    <!--<a   th:href="@{/delete?(id=${user.id})}">删除</a>-->
                    <!--<input type="button" onclick="login(${user.id})"  value="删除">-->
                    <!--<button onclick="login(${user.id})">删除</button>-->
                    <button th:onclick="'javascript:login(\''+${user.id}+'\');'">删除</button>
                </td>

            </tr>
            </tbody>
        </table>
    </div>



</div>
<script type="text/javascript">
    function  login(str) {
        $.ajax({
            type: "get",
            url: "/delete?id="+str,
            success: function(data){
                if (data == "1"){
                    alert("删除成功")
                    window.location.reload()
                }else {
                    alert("删除失败")
                    false
                }
            }
        });
    }
</script>
</body>
</html>